let loginComponent = {
    template: `
        <div class="login">
        <div class="title">
              <img src="./login/logo.png">
              {{platform === 'psychologist'?'Come create your own interactive digital hypnosis':'Come experience interactive hypnosis'}}
        </div>
        
            <el-form
          ref="form"
          size="medium"
          :rules="rules"
          :model="queryForm"
          label-width="80px"
          label-position="top"
          style="width: 90%; margin: 0 auto"
        >
          <el-form-item label="User ID：" prop="info">
            <el-input
              v-model="queryForm.info"
              placeholder="please input your User ID"
              clearable
         
            >
            </el-input>
          </el-form-item>
          <el-form-item label="Password：" prop="key">
            <el-input
              type="password"
              v-model="queryForm.key"
              placeholder="please input your password"
              clearable
            ></el-input>
          </el-form-item>
   
          <el-checkbox v-show="false" v-model="checked">Stay signed in</el-checkbox>
          
  
         
          
            <el-button type="primary" @click="onSubmit" class="login-btn"
              >Login</el-button
            >
          
        
   
            <el-button type="success" @click="toPage" class="login-btn"
              >Register</el-button
            >
          
        
        </el-form>
        </div>
    `,
    data() {
        return {
            rules: [],
            queryForm: {"type":"name", "info":"", "key":""},
            checked: true,
            platform: platform
        }

    },
    computed: {},
    watch: {},
    mounted() {
        let cache = sessionStorage.getItem('loginInfo')
        if(cache){
            let loginInfo = JSON.parse(cache)
            this.queryForm.info = loginInfo.info
            this.queryForm.key = loginInfo.key
        }
    },
    activated() {

    },
    methods: {
        toPage(){
            this.$router.push({
                name: 'register'
            })
        },
        onSubmit(){
            if(!this.queryForm.info||!this.queryForm.key){
                this.$message.error('Please input your user ID and password')
                return
            }
            //25d55ad283aa400af464c76d713c07ad
            user.login({
                type: this.queryForm.type,
                info: this.queryForm.info,
                key: CryptoJS.MD5(this.queryForm.key).toString(CryptoJS.enc.Hex),
                platform
            },this.checked).then((result)=>{
                if(result.identity){
                    sessionStorage.removeItem('loginInfo')
                    // if(this.checked){
                        sessionStorage.setItem('loginInfo',JSON.stringify({
                            info: this.queryForm.info,
                            key: this.queryForm.key
                        }))
                    // }
                    let path = '/'
                    if(platform=='psychologist'){
                        path = 'home'
                    }
                    this.$router.push({
                        path:  path
                    })
                } else {
                    this.$message.error(result)
                }
            }).catch((e)=>{
                // this.$message.error('user ID or password is wrong')
            })
        }
    },
    components: {},
    beforeRouteLeave(to, from, next) {

        next();
    }
}

